document.addEventListener('DOMContentLoaded', function() {
    // 从 Chrome 存储中获取之前保存的搜索类型设置
    chrome.storage.sync.get(['pinyinType'], function(result) {
        // 检查是否存在已保存的搜索类型设置
        if (result.pinyinType) {
            // 根据保存的搜索类型查找对应的单选按钮
            const radioButton = document.querySelector(`input[value="${result.pinyinType}"]`);
            if (radioButton) {
                // 如果找到对应的单选按钮,将其设置为选中状态
                radioButton.checked = true;
            } else {
                // 如果没有找到对应的单选按钮(可能是配置错误或版本更新)
                // 则将默认的 fuzzy(模糊搜索) 选项设置为选中状态
                const defaultRadio = document.querySelector('input[value="fuzzy"]');
                if (defaultRadio) {
                    defaultRadio.checked = true;
                }
            }
        } else {
            // 如果没有保存过搜索类型设置
            // 则将默认的 fuzzy(模糊搜索) 选项设置为选中状态
            const defaultRadio = document.querySelector('input[value="fuzzy"]');
            if (defaultRadio) {
                defaultRadio.checked = true;
            }
        }
    });

    // 为所有 radio 按钮添加改变事件监听器
    const radioButtons = document.querySelectorAll('input[type="radio"]');
    radioButtons.forEach(radio => {
        radio.addEventListener('change', function(e) {
            if (this.checked) {
                // 保存选择到 Chrome Storage
                chrome.storage.sync.set({
                    pinyinType: this.value
                });
            }
        });
    });

    // 获取DOM元素
    const searchInput = document.getElementById('searchInput'); // 搜索输入框
    const resultsDiv = document.getElementById('results'); // 搜索结果容器
    const searchTypeInputs = document.getElementsByName('searchType'); // 搜索类型单选按钮组
    const resultsCounter = document.getElementById('results-counter');
    let selectedIndex = -1; // 当前选中的书签索引
    let bookmarkItems = []; // 存储过滤后的书签数据

    // 页面加载时自动聚焦到搜索框
    searchInput.focus();

    // 处理键盘事件,实现键盘导航和选择功能
    document.addEventListener('keydown', async function(e) {
        // 如果按下 ESC 键
        if (e.key === 'Escape') {
            // 检查是否有打开的模态框
            const versionModal = document.getElementById('version-modal');
            const helpModal = document.getElementById('helpModal');
            const importExportModal = document.getElementById('importExportModal');
            const confirmDialog = document.querySelector('.confirm-dialog');
            const dialogOverlay = document.querySelector('.dialog-overlay');

            // 如果有模态框打开，则关闭模态框
            if (versionModal.style.display === 'block') {
                versionModal.style.display = 'none';
            } else if (helpModal.style.display === 'block') {
                helpModal.style.display = 'none';
            } else if (importExportModal.style.display === 'block') {
                importExportModal.style.display = 'none';
            } else if (confirmDialog.style.display === 'block') {
                confirmDialog.style.display = 'none';
                dialogOverlay.style.display = 'none';
            } else {
                // 如果没有模态框打开，则关闭插件窗口
                window.close();
            }
            return;
        }

        const items = document.querySelectorAll('.bookmark-item');
        
        switch(e.key) {
            case 'ArrowDown': // 向下箭头键
                e.preventDefault();
                if (selectedIndex < items.length - 1) {
                    selectedIndex++;
                    updateSelection(items);
                }
                break;
            
            case 'ArrowUp': // 向上箭头键
                e.preventDefault();
                if (selectedIndex > 0) {
                    selectedIndex--;
                    updateSelection(items);
                }
                break;
            
            case 'Enter': // 回车键,打开选中的书签
                e.preventDefault();
                if (selectedIndex >= 0 && selectedIndex < bookmarkItems.length) {
                    const bookmark = bookmarkItems[selectedIndex];
                    try {
                        await updateBookmarkClicks(bookmark.url);
                        chrome.tabs.create({ url: bookmark.url }, () => {
                            window.close();
                        });
                    } catch (error) {
                        console.error('处理书签点击时出错:', error);
                    }
                }
                break;
        }
    });

    // 更新书签项的选状态和滚动位置
    function updateSelection(items) {
        items.forEach((item, index) => {
            if (index === selectedIndex) {
                item.classList.add('selected');
                item.scrollIntoView({ block: 'nearest' }); // 确保选中项可见
            } else {
                item.classList.remove('selected');
            }
        });
    }

    // 获取网站favicon图标的URL
    function getFaviconUrl(url) {
        try {
            const urlObj = new URL(url);
            return urlObj.protocol + '//' + urlObj.host + '/favicon.ico';
        } catch (e) {
            return 'chrome-logo-m100.svg'; // 如果URL无效则使用默认图标
        }
    }

    // 获取当前选中的搜索类型(前缀匹配或模糊匹配)
    function getSearchType() {
        return Array.from(searchTypeInputs).find(input => input.checked).value;
    }

    // 根据搜索类型和查询词过滤书签
    function filterBookmarks(bookmarks, query) {
        if (!query) return bookmarks.filter(bookmark => bookmark.url);

        const searchType = getSearchType();
        const lowerQuery = query.toLowerCase();

        return bookmarks.filter(bookmark => {
            if (!bookmark.url) return false;
            const title = bookmark.title;
            const lowerTitle = title.toLowerCase();
            
            switch (searchType) {
                case 'prefix': // 前缀匹配
                    return lowerTitle.startsWith(lowerQuery);
                case 'fuzzy': // 模糊匹配
                    // 将查询词按空格分隔成数组
                    const keywords = lowerQuery.split(/\s+/).filter(k => k.length > 0);
                    // 检查每个关键词是否都包含在标题中
                    return keywords.every(keyword => lowerTitle.includes(keyword));
                case 'pinyin': // 拼音匹配
                    // 使用pinyin-pro的API
                    const titlePinyin = pinyinPro.pinyin(title, { toneType: 'none', type: 'array' }).join('');
                    const titleInitials = pinyinPro.pinyin(title, { pattern: 'first', toneType: 'none', type: 'array' }).join('');
                    return titlePinyin.includes(lowerQuery) ||      // 匹配完整拼音
                           titleInitials.includes(lowerQuery) ||    // 匹配首字母
                           lowerTitle.includes(lowerQuery);         // 匹配原文
                default:
                    return false;
            }
        });
    }

    // 获取书签的完整路径
    async function getBookmarkPath(bookmark) {
        let path = [];
        let current = bookmark;

        // 递归获取父书签文件夹
        while (current.parentId) {
            try {
                const parent = (await chrome.bookmarks.get(current.parentId))[0];
                if (parent.title) {  // 只添加有标题的文夹
                    path.unshift(parent.title);
                }
                current = parent;
            } catch (e) {
                break;
            }
        }

        return path;
    }

    // 添加获取书签点击次数的函数
    // 这个函数用于获取所有书签的点击次数记录
    // 返回一个 Promise 对象,包含一个对象,其中:
    // - 键(key)是书签的URL
    // - 值(value)是该书签被点击的次数
    // 使用 chrome.storage.sync API 从同步存储中读取数据
    // 如果 bookmarkClicks 不存在则返回空对象 {}
    async function getBookmarkClicks() {
        return new Promise((resolve) => {
            chrome.storage.sync.get(['bookmarkClicks'], function(result) {
                resolve(result.bookmarkClicks || {});
            });
        });
    }

    // 更新书签点击次数
    async function updateBookmarkClicks(url) {
        try {
            // 使用 await 等待获取当前点击数据
            const result = await new Promise((resolve) => {
                chrome.storage.sync.get(['bookmarkClicks'], resolve);
            });
            
            const clicks = result.bookmarkClicks || {};
            clicks[url] = (clicks[url] || 0) + 1;
            
            // 使用 await 等待数据保存
            await new Promise((resolve) => {
                chrome.storage.sync.set({ bookmarkClicks: clicks }, resolve);
            });
            
            console.log(`书签 ${url} 点击次数已更新为: ${clicks[url]}`);
            return clicks[url];
        } catch (error) {
            console.error('更新点击次数时出错:', error);
        }
    }

    // 修改显示书签的函数
    function displayBookmarks(query = '') {
        chrome.bookmarks.search({}, async function(bookmarks) {
            resultsDiv.innerHTML = '';
            
            // 获取书签点击次数
            const clicks = await getBookmarkClicks();
            // 打印书签点击次数的总数
            console.log('书签点击记录数量:', Object.keys(clicks).length);
            console.log('书签点击记录:', clicks);
            // 打印书签总数量
            console.log('书签总数量:', bookmarks.length);
            
            // 过滤书签并同时计算点击次数
            const filteredBookmarks = filterBookmarks(bookmarks, query).map(bookmark => ({
                bookmark,
                clickCount: clicks[bookmark.url] || 0
            }));
            
            // 使用更高效的排序方式
            filteredBookmarks.sort((a, b) => b.clickCount - a.clickCount);

            // 取前50条并提取bookmark对象
            bookmarkItems = filteredBookmarks.slice(0, 50).map(item => item.bookmark);

            // 更新结果计数
            const totalResults = filteredBookmarks.length;
            const displayedResults = bookmarkItems.length;
            if (totalResults > 50) {
                resultsCounter.textContent = `显示${displayedResults}个结果（共${totalResults}个）`;
            } else {
                resultsCounter.textContent = `${totalResults}个结果`;
            }

            // 创建书签项
            for (let i = 0; i < bookmarkItems.length; i++) {
                const bookmark = bookmarkItems[i];
                const div = document.createElement('div');
                div.className = 'bookmark-item';
                
                const favicon = document.createElement('img');
                favicon.className = 'favicon';
                favicon.src = getFaviconUrl(bookmark.url);
                favicon.onerror = () => {
                    favicon.src = 'chrome-logo-m100.svg';
                };
                
                const contentDiv = document.createElement('div');
                contentDiv.className = 'bookmark-content';
                
                const title = document.createElement('div');
                title.className = 'bookmark-title';
                title.textContent = bookmark.title;
                
                // 修改点击次数显示
                const clickCount = document.createElement('div');
                clickCount.className = 'click-badge';
                if (clicks[bookmark.url]) {
                    clickCount.textContent = clicks[bookmark.url];
                    clickCount.title = `点击次数: ${clicks[bookmark.url]}`;
                }
                title.appendChild(clickCount);
                
                const path = document.createElement('div');
                path.className = 'bookmark-path';
                
                // 获取并显示路径
                const pathArray = await getBookmarkPath(bookmark);
                if (pathArray.length > 0) {
                    path.textContent = pathArray.join(' > ');
                }
                
                contentDiv.appendChild(title);
                contentDiv.appendChild(path);
                
                div.appendChild(favicon);
                div.appendChild(contentDiv);
                
                // 添加清除点击次数按钮
                const clearClicksBtn = document.createElement('button');
                clearClicksBtn.className = 'clear-clicks-btn';
                clearClicksBtn.innerHTML = '⟲';  // 使用重置图标
                clearClicksBtn.title = '清除点击次数';

                // 添加清除点击次数的点击事件
                clearClicksBtn.addEventListener('click', async (e) => {
                    e.stopPropagation(); // 阻止事件冒泡
                    showClearClicksConfirmDialog(bookmark);
                });

                div.appendChild(clearClicksBtn);
                
                // 添加修改按钮
                const editBtn = document.createElement('button');
                editBtn.className = 'edit-btn';
                editBtn.innerHTML = '✎';
                editBtn.title = '修改标题 按ESC键或鼠标右键取消';
                
                // 添加修改按钮的点击事件
                editBtn.addEventListener('click', (e) => {
                    e.stopPropagation(); // 阻止事件冒泡
                    startEditing(bookmark, title);
                });
                
                div.appendChild(editBtn);
                
                // 添加删除按钮
                const deleteBtn = document.createElement('button');
                deleteBtn.className = 'delete-btn';
                deleteBtn.innerHTML = '✕';
                deleteBtn.title = '删除书签';
                
                // 添加删除按钮的点击事件
                deleteBtn.addEventListener('click', async (e) => {
                    e.stopPropagation(); // 阻止事件冒泡，防止触发书签打开
                    showDeleteConfirmDialog(bookmark);
                });
                
                div.appendChild(deleteBtn);
                
                div.addEventListener('mouseover', () => {
                    selectedIndex = i;
                    updateSelection(document.querySelectorAll('.bookmark-item'));
                });
                
                // 鼠标点击修改点击事件处理 
                div.addEventListener('click', async () => {
                    try {
                        // 先等待点击次数更新完成
                        await updateBookmarkClicks(bookmark.url);
                        // 再创建新标签
                        chrome.tabs.create({ url: bookmark.url }, () => {
                            window.close();
                        });
                    } catch (error) {
                        console.error('处理书签点击时出错:', error);
                    }
                });
                
                // 添加右键菜单禁用
                div.addEventListener('contextmenu', (e) => {
                    e.preventDefault(); // 阻止默认的右键菜单
                    return false;
                });
                
                resultsDiv.appendChild(div);
            }
        });
    }

    // 初始加载时显示所有书签
    displayBookmarks();

    // 监听搜索输入,实时更新结果
    searchInput.addEventListener('input', function() {
        selectedIndex = -1; // 重置选中索引
        displayBookmarks(this.value);
    });

    // 监听搜索类型切换
    searchTypeInputs.forEach(input => {
        input.addEventListener('change', () => {
            updatePlaceholder();
            displayBookmarks(searchInput.value);
        });
    });

    // 在DOMContentLoaded事件处理函数中添加
    function updatePlaceholder() {
        const searchType = getSearchType();
        switch (searchType) {
            case 'prefix':
                searchInput.placeholder = '搜索书签...（前缀匹配）';
                break;
            case 'fuzzy':
                searchInput.placeholder = '搜索书签...（模糊匹配，支持空格分隔）例如：百度 翻译';
                break;
            case 'pinyin':
                searchInput.placeholder = '搜索书签...（支持拼音）';
                break;
        }
    }

    // 初始化时调用
    updatePlaceholder();

    // 添加键盘快捷键处理
    document.addEventListener('keydown', function(e) {
        // 检查是否按下了 Ctrl 键 (Mac 上是 Command 键)
        if (e.ctrlKey || e.metaKey) {
            let radioToSelect = null;
            
            switch (e.key) {
                case '1':
                    radioToSelect = document.querySelector('input[value="prefix"]');
                    break;
                case '2':
                    radioToSelect = document.querySelector('input[value="fuzzy"]');
                    break;
                case '3':
                    radioToSelect = document.querySelector('input[value="pinyin"]');
                    break;
            }
            
            if (radioToSelect) {
                e.preventDefault(); // 阻止默认行为
                radioToSelect.checked = true;
                // 触发 change 事件以更新搜索结果
                radioToSelect.dispatchEvent(new Event('change'));
                // 保存选择到 Chrome Storage
                chrome.storage.sync.set({
                    pinyinType: radioToSelect.value
                });
            }
        }
    });

    // 添加确认对话框相关函数
    function showDeleteConfirmDialog(bookmark) {
        const overlay = document.querySelector('.dialog-overlay');
        const dialog = document.querySelector('.confirm-dialog');
        const cancelBtn = dialog.querySelector('.cancel-btn');
        const confirmBtn = dialog.querySelector('.confirm-btn');

        // 显示对话框
        overlay.style.display = 'block';
        dialog.style.display = 'block';

        // 处理取消按钮
        const hideDialog = () => {
            overlay.style.display = 'none';
            dialog.style.display = 'none';
        };

        cancelBtn.onclick = hideDialog;
        overlay.onclick = hideDialog;

        // 处理确认删除
        confirmBtn.onclick = async () => {
            try {
                await chrome.bookmarks.remove(bookmark.id);
                hideDialog();
                // 重新加载书签列表
                displayBookmarks(document.getElementById('searchInput').value);
            } catch (error) {
                console.error('删除书签时出错:', error);
                alert('删除书签失败请重试');
            }
        };
    }

    // 添加键盘事件处理 Escape 键关闭对话框, Enter 键确认删除
    document.addEventListener('keydown', function(e) {
        const dialog = document.querySelector('.confirm-dialog');
        if (dialog.style.display === 'block') {
            if (e.key === 'Escape') {
                // ESC 键关闭对话框
                dialog.style.display = 'none';
                document.querySelector('.dialog-overlay').style.display = 'none';
            } else if (e.key === 'Enter') {
                // 回车键确认删除
                dialog.querySelector('.confirm-btn').click();
            }
        }
    });

    // 替换原来的 radio 相关代码
    const searchModes = document.querySelectorAll('.search-mode');
    
    // 获取保存的搜索模式
    chrome.storage.sync.get(['pinyinType'], function(result) {
        if (result.pinyinType) {
            const activeMode = document.querySelector(`.search-mode[data-type="${result.pinyinType}"]`);
            if (activeMode) {
                searchModes.forEach(mode => mode.classList.remove('active'));
                activeMode.classList.add('active');
            }
        } else {
            // 默认选中第一个
            searchModes[0].classList.add('active');
        }
    });

    // 为所有搜索模式添加点击事件
    searchModes.forEach(mode => {
        mode.addEventListener('click', function() {
            // 移除其他模式的激活状态
            searchModes.forEach(m => m.classList.remove('active'));
            // 添加当前模式的激活状态
            this.classList.add('active');
            // 保存选择到 Chrome Storage
            chrome.storage.sync.set({
                pinyinType: this.dataset.type
            });
            // 更新搜索结果
            displayBookmarks(searchInput.value);
        });
    });

    // 修改获取搜索类型的函数
    function getSearchType() {
        const activeMode = document.querySelector('.search-mode.active');
        return activeMode ? activeMode.dataset.type : 'fuzzy';
    }

    // 添加键盘快捷键处理
    document.addEventListener('keydown', function(e) {
        if (e.ctrlKey || e.metaKey) {
            let modeToSelect = null;
            
            switch (e.key) {
                case '1':
                    modeToSelect = document.querySelector('.search-mode[data-type="prefix"]');
                    break;
                case '2':
                    modeToSelect = document.querySelector('.search-mode[data-type="fuzzy"]');
                    break;
                case '3':
                    modeToSelect = document.querySelector('.search-mode[data-type="pinyin"]');
                    break;
            }
            
            if (modeToSelect) {
                e.preventDefault();
                searchModes.forEach(mode => mode.classList.remove('active'));
                modeToSelect.classList.add('active');
                chrome.storage.sync.set({
                    pinyinType: modeToSelect.dataset.type
                });
                displayBookmarks(searchInput.value);
            }
        }
    });

    // 版本更新相关
    const versionIcon = document.querySelector('.version-icon');
    const versionModal = document.getElementById('version-modal');
    const versionContent = versionModal.querySelector('.version-content');
    
    // 获取并解析 CHANGELOG.md 内容
    async function fetchChangeLog() {
        try {
            const response = await fetch('md/CHANGELOG.md');
            const text = await response.text();
            
            // 简单的 Markdown 解析
            const html = text
                // 替换标题
                .replace(/^# (.*$)/gm, '<h1>$1</h1>')
                .replace(/^## (.*$)/gm, '<h2>$1</h2>')
                .replace(/^### (.*$)/gm, '<h3>$1</h3>')
                .replace(/^#### (.*$)/gm, '<h4>$1</h4>')
                .replace(/^##### (.*$)/gm, '<h5>$1</h5>')
                // 替换列表
                .replace(/^- (.*$)/gm, '<li>$1</li>')
                // 包装列表
                .replace(/<li>.*?(?=<h|$)/gs, match => `<ul>${match}</ul>`)
                // 清理空列表
                .replace(/<ul>\s*<\/ul>/g, '');

            versionContent.innerHTML = html;
        } catch (error) {
            console.error('加载更新日志失败:', error);
            versionContent.innerHTML = '<p style="color: red;">加载更新日志失败</p>';
        }
    }

    // 点击版本图标显示更新日志
    versionIcon.addEventListener('click', function(e) {
        e.stopPropagation();
        versionModal.style.display = 'block';
        fetchChangeLog(); // 加载更新日志
    });

    // 关闭版本更新弹窗
    versionModal.querySelector('.close-btn').addEventListener('click', function() {
        versionModal.style.display = 'none';
    });

    // 点击弹窗外部关闭
    versionModal.addEventListener('click', function(e) {
        if (e.target === versionModal) {
            versionModal.style.display = 'none';
        }
    });

    // 修改现有的 ESC 键处理，添加版本弹窗的关闭
    document.addEventListener('keydown', function(e) {
        if (e.key === 'Escape') {
            if (versionModal.style.display === 'block') {
                versionModal.style.display = 'none';
            }
            // ... 其他模态框的处理 ...
        }
    });

    // 帮助图标点击事件处理
    const helpIcon = document.querySelector('.help-icon');
    const helpModal = document.getElementById('helpModal');
    const helpContent = document.getElementById('helpContent');

    // 加载并显示帮助内容
    async function loadHelpContent() {
        try {
            // 使用与 CHANGELOG.md 相同的方加载 INFO.md
            const response = await fetch('md/INFO.md');
            const text = await response.text();
            
            // 使用与 CHANGELOG.md 相同的解析方式
            const html = text
                .replace(/^# (.*$)/gm, '<h1>$1</h1>')
                .replace(/^## (.*$)/gm, '<h2>$1</h2>')  // 修复这里的$2为$1
                .replace(/^### (.*$)/gm, '<h3>$1</h3>')
                .replace(/^#### (.*$)/gm, '<h4>$1</h4>')
                .replace(/^##### (.*$)/gm, '<h5>$1</h5>')
                .replace(/^- (.*$)/gm, '<li>$1</li>')
                .replace(/<li>.*?(?=<h|$)/gs, match => `<ul>${match}</ul>`)
                .replace(/<ul>\s*<\/ul>/g, '');

            helpContent.innerHTML = html;
            helpModal.style.display = 'block';
        } catch (error) {
            console.error('加载帮助内容失败:', error);
            helpContent.innerHTML = '<p style="color: red;">加载帮助内容失败</p>';
        }
    }

    // 添加帮助图标点击事件
    helpIcon.addEventListener('click', loadHelpContent);

    // 添加关闭按钮事件
    helpModal.querySelector('.close').addEventListener('click', () => {
        helpModal.style.display = 'none';
    });

    // 点击模态框外部关闭
    helpModal.addEventListener('click', (e) => {
        if (e.target === helpModal) {
            helpModal.style.display = 'none';
        }
    });

    // 添加 ESC 键关闭功能
    document.addEventListener('keydown', (e) => {
        if (e.key === 'Escape' && helpModal.style.display === 'block') {
            helpModal.style.display = 'none';
        }
    });

    // 添加开始编辑功能
    function startEditing(bookmark, titleElement) {
        const input = document.createElement('input');
        input.type = 'text';
        input.className = 'edit-title-input';
        input.value = bookmark.title;
        
        // 保存原始内容和点击次数元素
        const clickCountSpan = titleElement.querySelector('.click-count');
        const originalContent = bookmark.title;
        
        // 清空标题元素并添加输入框
        titleElement.textContent = '';
        titleElement.appendChild(input);
        if (clickCountSpan) {
            titleElement.appendChild(clickCountSpan);
        }
        
        input.focus();
        input.select();
        
        // 修改后的 handleBlur 函数
        const handleBlur = async () => {
            const newTitle = input.value.trim();
            
            // 移除所有事件监听器
            input.removeEventListener('blur', handleBlur);
            input.removeEventListener('keydown', handleKeydown);
            input.removeEventListener('click', handleClick);
            
            if (newTitle && newTitle !== bookmark.title) {
                try {
                    await chrome.bookmarks.update(bookmark.id, { title: newTitle });
                    // 直接设置文本内容而不是使用 innerHTML
                    titleElement.textContent = newTitle;
                    if (clickCountSpan) {
                        titleElement.appendChild(clickCountSpan);
                    }
                } catch (error) {
                    console.error('更新书签标题失败:', error);
                    titleElement.textContent = originalContent;
                    if (clickCountSpan) {
                        titleElement.appendChild(clickCountSpan);
                    }
                }
            } else {
                titleElement.textContent = originalContent;
                if (clickCountSpan) {
                    titleElement.appendChild(clickCountSpan);
                }
            }
        };
        
        // 处理键盘事件
        const handleKeydown = (e) => {
            e.stopPropagation(); // 阻止键盘事件冒泡
            if (e.key === 'Enter') {
                input.blur(); // 触发失去焦点事件
            } else if (e.key === 'Escape') {
                titleElement.textContent = originalContent;
                input.removeEventListener('blur', handleBlur);
                input.removeEventListener('keydown', handleKeydown);
                input.removeEventListener('click', handleClick);
            }
        };
        
        // 处理点击事件
        const handleClick = (e) => {
            e.stopPropagation();
        };
        
        input.addEventListener('blur', handleBlur);
        input.addEventListener('keydown', handleKeydown);
        input.addEventListener('click', handleClick);
    }

    // 添加清除点击次数的确认对话框函数
    function showClearClicksConfirmDialog(bookmark) {
        const overlay = document.querySelector('.dialog-overlay');
        const dialog = document.querySelector('.confirm-dialog');
        const dialogContent = dialog.querySelector('.dialog-content p');
        const cancelBtn = dialog.querySelector('.cancel-btn');
        const confirmBtn = dialog.querySelector('.confirm-btn');

        // 修改对话框内容
        dialogContent.textContent = '确定要清除这个书签的点击次数吗？此操作无法撤销。';
        
        // 显示对话框
        overlay.style.display = 'block';
        dialog.style.display = 'block';

        // 处理取消按钮
        const hideDialog = () => {
            overlay.style.display = 'none';
            dialog.style.display = 'none';
        };

        cancelBtn.onclick = hideDialog;
        overlay.onclick = hideDialog;

        // 处理确认清除
        confirmBtn.onclick = async () => {
            try {
                // 获取当前点击数据
                const result = await new Promise((resolve) => {
                    chrome.storage.sync.get(['bookmarkClicks'], resolve);
                });
                
                const clicks = result.bookmarkClicks || {};
                
                // 删除该书签的点击记录
                delete clicks[bookmark.url];
                
                // 保存更新后的数据
                await new Promise((resolve) => {
                    chrome.storage.sync.set({ bookmarkClicks: clicks }, resolve);
                });
                
                hideDialog();
                // 重新加载书签列表以更新显示
                displayBookmarks(document.getElementById('searchInput').value);
                
                console.log(`已清除书签 ${bookmark.url} 的点击次数`);
            } catch (error) {
                console.error('清除点击次数时出错:', error);
                alert('清除点击次数失败，请重试');
            }
        };
    }

    // 在 DOMContentLoaded 事件处理函数中添加
    const importExportIcon = document.querySelector('.import-export-icon');
    const importExportModal = document.getElementById('importExportModal');
    const importExportArea = document.getElementById('importExportArea');
    const exportBtn = document.getElementById('exportBtn');
    const importBtn = document.getElementById('importBtn');
    const importExportMessage = document.getElementById('importExportMessage');

    // 显示导入导出弹层
    importExportIcon.addEventListener('click', async () => {
        importExportModal.style.display = 'block';
        importExportArea.value = '';
        importExportMessage.textContent = '';
    });

    // 关闭导入导出弹层
    importExportModal.querySelector('.close-btn').addEventListener('click', () => {
        importExportModal.style.display = 'none';
    });

    // 点击弹层外部关闭
    importExportModal.addEventListener('click', (e) => {
        if (e.target === importExportModal) {
            importExportModal.style.display = 'none';
        }
    });

    // 导出功能
    exportBtn.addEventListener('click', async () => {
        try {
            const result = await chrome.storage.sync.get(['bookmarkClicks']);
            const bookmarkClicks = result.bookmarkClicks || {};
            const exportData = JSON.stringify(bookmarkClicks, null, 2);
            importExportArea.value = exportData;
            showMessage('数据导出成功！', 'success');
            
            // 自动复制到剪贴板
            importExportArea.select();
            await navigator.clipboard.writeText(exportData);
            
            // 导出到文件
            const blob = new Blob([exportData], {type: 'application/json'});
            const fileHandle = await window.showSaveFilePicker({
                suggestedName: 'bookmark_clicks.json',
                types: [{
                    description: 'JSON Files',
                    accept: {'application/json': ['.json']},
                }],
            });
            const writable = await fileHandle.createWritable();
            await writable.write(blob);
            await writable.close();
            
            showMessage('数据已导出到文件并复制到剪贴板！', 'success');
        } catch (error) {
            console.error('导出失败:', error);
            showMessage('导出失败，请重试', 'error');
        }
    });

    // 导入功能
    importBtn.addEventListener('click', async () => {
        try {
            const importData = JSON.parse(importExportArea.value);
            
            // 验证导入数据格式
            if (typeof importData !== 'object') {
                throw new Error('导入数据格式错误');
            }
            
            // 验证数据有效性
            for (const [url, count] of Object.entries(importData)) {
                if (typeof count !== 'number' || count < 0) {
                    throw new Error('点击次数必须是非负数');
                }
            }
            
            // 保存导入的数据
            await chrome.storage.sync.set({ bookmarkClicks: importData });
            showMessage('数据导入成功！', 'success');
            
            // 刷新显示
            displayBookmarks(document.getElementById('searchInput').value);
        } catch (error) {
            console.error('导入失败:', error);
            showMessage('导入失败：' + error.message, 'error');
        }
    });

    // 显示消息
    function showMessage(message, type) {
        importExportMessage.textContent = message;
        importExportMessage.className = 'import-export-message';
        if (type) {
            importExportMessage.classList.add(`import-export-${type}`);
        }
    }

    // 添加ESC键关闭弹层
    document.addEventListener('keydown', (e) => {
        if (e.key === 'Escape') {
            if (importExportModal.style.display === 'block') {
                importExportModal.style.display = 'none';
            }
        }
    });
}); 